<template>
  <div class="bottomAddCar">
    <div class="contain">
      <!-- <van-icon name="shopping-cart-o" :badge="cartlistLength" size="40" /> -->
      <van-icon name="shopping-cart-o"  size="40" />
      <van-button type="primary" round>加入购物车</van-button>
    </div>
  </div>
</template>

<script>
import Cart from '@/api/cart';
export default {
  data() {
    return {
      cartlistLength: 0,
    }
  },
  mounted() {
    // this.getCartlistLength()
  },
  
  methods: {
    async getCartlistLength() {
      let res = await Cart.getClubsList()
      console.log(res)
      this.cartlistLength = res.data.length
    },
  },
  activated() {
    // this.getCartlistLength()
  }
}
</script>

<style scoped lang="scss">
.bottomAddCar {
  height: 100%;
  width: 100%;
  // background: #fff;
position: relative;
  .contain {
    display: flex;
    justify-content: space-between;
    padding-left: 30px;
    padding-right: 30px;
  .van-icon{
    position: absolute;
    left: 150px;
    z-index: 2;
    color: #fff;
  }
    .van-button {
     width: 200px;
     position: absolute;
     left:0px;
    }
  }
}
</style>

